// 这里写全局的layout样式
// 页面头部样式
.rx-layout-header {
  @apply flex
  justify-between
  flex-items-center
  p-r-16;
  height: calc(var(--td-comp-size-xxxl) - 1px);
  border-bottom: 1px solid var(--td-component-stroke);
  .rx-layout-header-left {
  }
  .rx-layout-header-right {
    @apply flex flex-items-center gap-12;
  }
}

// 页面navs导航样式
.rx-layout-navs {
  @apply h32 bg-#fff transition-all-300;
  .t-tabs__btn {
    width: 32px;
  }
  .t-tabs__nav--card.t-tabs__nav-item {
    padding-left: 10px;
    padding-right: 8px;
  }
  .t-tabs__nav-item.t-size-m,
  .t-tabs__btn.t-size-m {
    height: 32px;
    line-height: 32px;
  }
}

// 页面内容导航样式
.rx-layout-content {
  @apply transition-all-300;
  overflow-x: hidden;
  overflow-y: auto;
  height: calc(100vh - var(--td-comp-size-xxxl) - 32px);
  .page-wrapper {
    @apply m10 p10 bg-#fff b-rd-4;
    min-height: calc(100vh - var(--td-comp-size-xxxl) - 72px);
  }
}

// 页面菜单样式
.rx-layout-menu {
  .logo {
  }
}
